@extends('common.base-master')

@section('html-title')
    <title>波罗鸡-修改密码</title>
@endsection

@section('html-head')

@endsection

@section('html-body')
    <div class="reset-page">
    <form action="post" class="">
        <h5>重设新密码</h5>
        <div class="input-container password-input">
            <span class="input-icon bg-lock_icon"></span>
            <input type="password" name="old_password" id="old_password"  placeholder="请输旧密码">
            <span class="error-icon bg-tanhao_icon hidden"></span>
        </div>
        <div class="input-container password-input">
            <span class="input-icon bg-lock_icon"></span>
            <input type="password" name="password1" id="password1"  placeholder="请输新密码">
            <span class="error-icon bg-tanhao_icon hidden"></span>
        </div>
        <div class="input-container password-input">
            <span class="input-icon bg-lock_icon"></span>
            <input type="password" name="password2" id="password2" placeholder="再次输入新密码">
            <span class="error-icon bg-tanhao_icon hidden"></span>
        </div>
        <span class="worning-text hidden">两次输入的密码不一致</span>
        <input class="submit-btn" type="button" id="btn" value="确定">
    </form>
    <!-- 提示框，先隐藏 -->
    <div class="alert-container hidden">
        <div class="alert-box">
            <span class="bg-simile_icon"></span>
            <span class="alert-msg">密码修改成功</span>
            <span class="alert-tips">3s后将自动跳转到登录页面</span>
        </div>
    </div>
    </div>
    <script>
        $(document).ready(function () {
            $('#btn').click(function () {
                var oldPassword = $('#old_password').val();
                var password1   = $('#password1').val();
                var password2   = $('#password2').val();

                if(password1 != password2){
                    $('.worning-text').html('两次输入的密码不一致');
                    $('.worning-text').removeClass('hidden');
                    return false;
                }

                if(password1.length < 6 || password1.length > 20){
                    $('.worning-text').html('密码长度为6-20位');
                    $('.worning-text').removeClass('hidden');
                    return false;
                }
                $('.worning-text').addClass('hidden');

                $.ajax({
                    url:"{{route('Api.User.changePassword')}}",
                    type:'post',
                    dataType:'json',
                    data:{
                        new_password:password1,
                        old_password:oldPassword
                    },
                    success:function (obj) {
                        if(obj.level == 'success'){
                            $('.alert-container').removeClass('hidden');
                            setTimeout(function(){
                                window.location.href="{{route('Home.Auth.login')}}";
                            }, 3000);
                        }else {
                            $.toast(obj.message,"forbidden");
                        }
                    },
                    error:function (obj) {
                        console.log(obj);
                    }
                });
            });
        })
    </script>
@endsection